-
Notifications
You must be signed in to change notification settings - Fork 177
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[MWPW-158773] : Aside notification CLS performance improvements #3536
Conversation
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## stage #3536 +/- ##
=======================================
Coverage 96.47% 96.47%
=======================================
Files 260 260
Lines 60582 60584 +2
=======================================
+ Hits 58444 58446 +2
Misses 2138 2138 ☔ View full report in Codecov by Sentry. |
This pull request is not passing all required checks. Please see this discussion for information on how to get all checks passing. Inconsistent checks can be manually retried. If a test absolutely can not pass for a good reason, please add a comment with an explanation to the PR. |
For the failing NALA tests you could try to clear the cache with this: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is a specific issue due to the image asset itself because the ratio of dimensions of the default image within |
I have tried this a couple of times but cache refresh did not help overcome the failed NALA test. Can we please re-run this since the tests are failing for a an unrelated component wrt this PR |
@sharmeeatadobe - we can't ask authors to start changing such images, especially since we don't have a way to figure out all the pages where this might occur. Backwards compatibility needs to be maintained, without affecting layout. The tablet view would be even more affected with this change: We don't want to introduce visual regressions in favor of minor performance enhancements, other solutions should be considered to address this. CC: @SilviuLCF |
Sure, I'll try with some alternative solution. Do you have any suggestions in mind? |
The aside notification component considers the width:auto for the lazy load image. This causes the text to shift right by the width of the loaded image and hence degrades CLS.
Resolves: MWPW-158773
Test URLs:
Before: https://main--bacom--adobecom.hlx.page/fragments/homepage/summit/summit-2025-product-page-promoid-5wyl7trb?martech=off
After: https://main--bacom--adobecom.hlx.page/fragments/homepage/summit/summit-2025-product-page-promoid-5wyl7trb?milolibs=mwpw-158773--milo--sharmeeatadobe&martech=off
Before: https://main--milo--adobecom.hlx.page/drafts/sharmeeb/aside-notification?martech=off
After: https://mwpw-158773--milo--sharmeeatadobe.hlx.page/drafts/sharmeeb/aside-notification?martech=off